<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<table border="2px">
    <caption>个人简介</caption>
    <tr>
        <td>照片</td>
        <td id="pcId"></td>
    </tr>
    <tr>
        <td>姓名</td>
        <td id="nameId"></td>
    </tr>
    <tr>
        <td>年龄</td>
        <td id="ageId"></td>
    </tr>
    <tr>
        <td>朋友</td>
        <td id="friendId"></td>
    </tr>

</table>
<script>
    let person={
        name:'lkp',
        age:23,
        friends:['小明','小来哦','小刚','小红'],
        imgUrl:'img/lkp.jpg'
    };
    let pcTd = document.querySelector('#pcId');
    let nameTd = document.querySelector('#nameId');
    let ageTd = document.querySelector('#ageId');
    let friendTd = document.querySelector('#friendId');
    let imgE = document.createElement('img');
    imgE.src=person.imgUrl;
    imgE.width=100;
    pcTd.append(imgE)
    nameTd.innerHTML=person.name;
    ageTd.innerHTML=person.age;
    let ulE = document.createElement('ul');
    for(let i=0;i<person.friends.length;i++){
        let liE = document.createElement('li');
        liE.innerHTML=person.friends[i];
        ulE.append(liE);
    }
    friendTd.append(ulE)
</script>
</body>
</html>